<template>
  <div class="tools">
    <el-divider content-position="left">打印案例</el-divider>
    <el-form ref="pFormRef" label-width="140px" :model="form" :inline-message="true" class="form-input-l">
      <el-form-item prop="type" label="文件方式">
        <el-radio-group v-model="form.type">
          <el-radio :label="0">服务器文件</el-radio>
          <el-radio :label="1">本地文件</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item prop="path" label="文件路径">
        <el-input type="text" v-model="form.path" placeholder="请输入路径"></el-input>
      </el-form-item>
      <el-form-item prop="printer" label="打印机">
        <el-radio-group v-model="form.printer">
          <el-radio :label="pt.name" v-for="pt in printerList" :key="pt.name">{{pt.name}}{{pt.isDefault?'【默认】':''}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item prop="paperSize" label="纸张大小">
        <el-select v-model="form.paperSize" placeholder="Select">
          <el-option v-for="item in paperSizes" :key="item" :label="item" :value="item" />
        </el-select>
      </el-form-item>
      <el-form-item prop="copies" label="打印份数">
        <el-input-number v-model="form.copies" :min="1" placeholder="请输入份数" />
      </el-form-item>
      <el-form-item prop="pageType" label="页码范围">
        <el-radio-group v-model="form.pageType">
          <el-radio :label="0">全部</el-radio>
          <el-radio :label="1">页码范围</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item prop="pages" label="页码范围" v-if="form.pageType==1">
        <el-input type="text" v-model="form.pages" placeholder="请输入页码，如1-3,5"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" :loading="printing" @click="doPrint()">打印</el-button>
      </el-form-item>
    </el-form>
    <el-divider content-position="left">外部系统打印</el-divider>
    <el-button type="primary" @click="webPrint()">打开测试</el-button>
    <el-divider content-position="left">消息案例</el-divider>
    <el-button type="primary" @click="sendMsg()">发送消息</el-button>
    <el-divider content-position="left">自动更新</el-divider>
    <el-button type="primary" @click="checkUpdate()">检查更新</el-button>
    <el-dialog v-model="showUpdater" title="下载更新" width="300" align-center>
      <span class="download-updater-title">发现了新版本，正在下载更新</span>
      <el-progress type="dashboard" :percentage="percentage" :color="colors" close-on-click-modal="false" close-on-press-escape="false">
        <template #default="{ percentage }">
          <span>{{ percentage }}%</span>
        </template>
      </el-progress>
    </el-dialog>
    <el-divider content-position="left">打开LIS</el-divider>
    <el-button type="primary" @click="openLis()">打开LIS</el-button>
    <!-- <el-button type="primary" @click="print1()">打印</el-button>
    <el-button type="primary" @click="print2()">打印2</el-button>
    <el-button type="primary" @click="openLis()">打开LIS</el-button> -->
  </div>
</template>

<script setup lang="ts">
// import { io } from 'socket.io-client';
import { ref, reactive, getCurrentInstance, onMounted, onUnmounted } from 'vue';
import { notifyType, notifyMessage } from '../utils/common';
import type { FormInstance } from 'element-plus'; //ElMessageBox
let { proxy }: any = getCurrentInstance();
// let socket = io('ws://localhost:10001', { withCredentials: true });
let printing = ref(false);
let showUpdater = ref(false);
let printerList: any = reactive([]);
let pFormRef = ref<FormInstance>();
let percentage = ref(0);
let form = reactive({
  type: 0,
  path: 'http://server.ysddev.cn:6130/demo.pdf', //'C:\\b.pdf',
  printer: '',
  orientation: '', //landscape 横向打印， portrait 竖向打印
  //scale: ,//缩放比例：noscale 无缩放, shrink 缩小, fit 适应
  paperSize: '', //纸张大小
  copies: 1,
  pageType: 0,
  pages: 1
});
let paperSizes = ['A2', 'A3', 'A4', 'A5', 'A6', 'letter', 'legal', 'tabloid', 'statement'];
const colors = [
  { color: '#f56c6c', percentage: 20 },
  { color: '#e6a23c', percentage: 40 },
  { color: '#5cb87a', percentage: 60 },
  { color: '#1989fa', percentage: 80 },
  { color: '#6f7ad3', percentage: 100 }
];

onMounted(() => {
  // getPrinters();
  // console.log(import.meta.env.VITE_SERVER_URL);
});

// async function getPrinters() {
//   //方式一：electron内部页面直接获取打印机
//   let temp = await window.electron.ipcRenderer.invoke('get-printers');
//   console.log(temp);
//   //方式二：electron外部系统通过ws获取打印机
//   socket.emit('wsGetPrinters', (res) => {
//     if (res && res.status.code === 1) {
//       printerList.push(...res.data.printers);
//     } else {
//       notifyMessage(res.status.msg, notifyType.warning, proxy);
//     }
//   });
// }

//离开页面销毁ws连接
onUnmounted(() => {
  // socket.disconnect();
});

function openLis() {
  // window.electron.ipcRenderer.send('open-window-url', {
  //   url: 'http://server.ysddev.cn:44376',
  //   isMaximize: true
  // });
}
function doPrint() {
  try {
    printing.value = true;
    let param: any = {
      pdf: form.path,
      options: {
        type: form.type,
        printer: form.printer,
        paperSize: form.paperSize,
        copies: form.copies,
        silent: false //不提示错误信息
      }
    };
    if (form.pageType === 1) {
      param.options.pages = form.pages;
    }
    // socket.emit('wsPrint', param, (res: any) => {
    //   if (res && res.status.code === 1) {
    //     notifyMessage(res.status.msg, notifyType.success, proxy);
    //   } else {
    //     notifyMessage(res.status.msg, notifyType.warning, proxy);
    //   }
    //   printing.value = false;
    // });
  } catch (err: any) {
    notifyMessage(err, notifyType.warning, proxy);
  }
}

async function sendMsg() {
  // const temp = await window.electron.ipcRenderer.send('show-notifier');
  // console.log(temp);
  // window.electron.ipcRenderer.send('flash-notifier');
}
function webPrint() {
  // window.electron.ipcRenderer.send('open-window-url', {
  //   url: 'http://server.ysddev.cn:6130/print'
  // });
  // // window.electron.ipcRenderer.send('open-window-url', {
  // //   url: 'http://server.ysddev.cn:44376',
  // //   isMaximize: true
  // // });
}
function checkUpdate() {
  // window.electron.ipcRenderer.send('check-for-update');
}
</script>
<style lang="scss">
.el-dialog__body {
  text-align: center;
}
.download-updater-title {
  margin-bottom: 15px;
  display: block;
}
</style>
